import React, {Component} from 'react';
import cs from 'classnames'
import BaseCmpt from '../BaseCmpt';
import './index.css';
import {Progress, Button} from 'antd';
import Ajax from '../../common/ajax';

class GroupBuy extends BaseCmpt {

    static defaultProps = {
        data: {
            type: 113,
            style: {},
            dataset: {}
        }
    };

    constructor(props) {
        super(props);
        this.state = {
            list: [],
        };
    }

    render() {
        var {onSelected, selected, data} = this.props;
        var {list} = this.state;
        var {style, dataset} = data;

        return (
            <div
                onClick={(e) => {
                    onSelected && onSelected(e)
                }}
                className={cs({'groupBuyList cmptEle': true, 'cmptEle_selected': selected})}
                style={style}
            >
                {
                    list && list.length > 0 ?
                        list.map(function (actItem) {
                            return (
                                <div className="groupBuy" key={actItem.id}>
                                    <img src={actItem.goods_info.image_url} alt="" className="groupBuy__img"/>
                                    <div className="groupBuy__info">
                                        <div className="groupBuy_body">
                                            <div className="groupBuy__name">{actItem.goods_info.name}</div>
                                            <div className="groupBuy__num">{actItem.group_lmt}人成团</div>
                                        </div>
                                        <div className="groupBuy__foot">
                                            <div className="groupBuy__priceWrap">
                                                <div className="groupBuy__price">￥{actItem.sale_price}</div>
                                                <div className="groupBuy__priceOld">
                                                    ￥{actItem.goods_info.market_price}</div>
                                            </div>
                                            <div className="groupBuy__btnWrap">
                                                <Button type="primary">去开团</Button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            )
                        })
                        :
                        <div className="empty">快去创建团购活动吧~</div>
                }
            </div>
        );
    }

    componentDidMount() {
        this._fetch();
    }

    _fetch() {
        var _self = this;

        Ajax.G('/openapi/CActivity/groupBuyActList', {}, function (data) {
            var actList = data.result.actList;

            _self.setState({
                list: actList,
            });
        });
    }

}

export default GroupBuy;
